(function($) {

    function customExtend(subClass, superClass) {
        let F = function() {};
        F.prototype = superClass.prototype;
        subClass.prototype = new F();
        subClass.prototype.constructor = superClass;

        subClass.superclass = superClass.prototype;
        if (superClass.prototype.constructor == Object.prototype.constructor) {
            superClass.prototype.constructor = superClass;
        }

    }
    let mOptions = {
        "total": 5, //总共显示几个星
        "beginIndex": 1, //开始时显示几颗星
        "noStarImg": "F:\\js\\jstest\\image\\nostar.jpg",
        "halfStarImg": "F:\\js\\jstest\\image\\halfstar.jpg",
        "starImg": "F:\\js\\jstest\\image\\star.jpg",
        "mouseEvent": "mouseover",
        "once": true, //点击之后就不能再词选择
        "select": "",
        "confirm": ""
    }

    function Star(el, options) {
        this.options = $.extend(true, options || {}, mOptions);
        console.log("total" + this.options.total)
        this.half = false;
        this._init(el);
        this._initEvent();
    }



    Star.prototype = {
        _init: function(el) {
            console.log("init ");
            let items = $('<ul class="eden-start-items"></ul>');
            el.append(items);
            this.items = el.find('.eden-start-items');
            for (var i = 0; i < this.options.total; i++) {
                this.items.append($('<li class="eden-star-item"><img src=' + this.options.noStarImg + ' alt="图片' + i + '" /></li>'));
            }
            if (this.options.beginIndex < 0) {
                this.options.beginIndex = 0;
            } else if (this.options.beginIndex >= this.options.total) {
                this.options.beginIndex = this.options.total - 1;
            }
            this.lightOn(el.find(".eden-start-items li").eq(this.options.beginIndex))
        },
        _initEvent: function() {
            let self = this;
            this.items.on(this.options.mouseEvent, '.eden-star-item', function(event) {
                let item = $(this);
                self.select(item, event);

                if ($.type(self.options.select) === 'function') {
                    self.options.select(item, item.index());
                }
            }).on('mouseout', '.eden-star-item', function(event) {
                self.lightOn($(this));

            }).on('click', '.eden-star-item', function(event) {
                if (self.options.once) {
                    self.items.off();
                }
                if ($.type(self.options.confirm) === 'function') {
                    self.options.confirm();
                }
            });;
        },
        lightOn: function(item) {
            let self = this;
            item.prevAll().find('img').attr({ "src": self.options.starImg });
            if (this.half) {
                item.find('img').attr({ "src": self.options.halfStarImg });
            } else {
                item.find('img').attr({ "src": self.options.starImg });
            }
            item.nextAll().find('img').attr({ "src": self.options.noStarImg });
        },
        select: function(item, event) {
            throw new Error("子类必须重写");

        },
        confirm: function() {
            throw new Error("子类必须重写");

        }
    }





    function EntireStar(el, options) {
        console.log("EntireStar")
        Star.call(this, el, options);
    }
    customExtend(EntireStar, Star);
    EntireStar.prototype.select = function(item, event) {
        this.half = false;
        this.lightOn(item);

    }
    EntireStar.prototype.confirm = function(item, event) {
        console.log("EntireStar confirm");
    }



    function HalfStar(el, options) {
        options = $.extend(true, options, { "mouseEvent": "mousemove" });
        console.log("HalfStar")
        Star.call(this, el, options);
    }
    customExtend(HalfStar, Star);


    HalfStar.prototype.select = function(item, event) {
        if (event.pageX - item.offset().left < item.width() / 2) {
            this.half = true;
        } else {
            this.half = false;
        }
        this.lightOn(item);
    }
    HalfStar.prototype.confirm = function() {

    }


    $.fn.EntireStar = function(options) {
        return this.each(function(index, el) {
            let self = $(this),
                instance = self.data("EntireStar");
            if (!instance) {
                self.data('EntireStar', instance = new EntireStar(self, options));
            }
        });
    }
    $.fn.HalfStar = function(options) {
        return this.each(function(index, el) {
            let self = $(this),
                instance = self.data("HalfStar");
            if (!instance) {
                self.data('HalfStar', instance = new HalfStar(self, options));
            }
        });
    }
    ////////////////////////////////////////////

})(jQuery)